import React from 'react';
import {Link, IndexLink } from 'react-router';
// import styles from './appStyles';
// import NavLink from '../NavLink';

const App = (props) => (
    <div>
        <h1>React Router 教学</h1>
        <ul>
            <li><IndexLink to = '/' activeClassName = 'active'>Home</IndexLink></li>
            <li><Link to = '/about' activeStyle = {{color: 'green'}}>About</Link></li>
            <li><Link to = '/repos/react-router' activeStyle = {{color: 'green'}}>Repos</Link></li>
            <li><Link to = '/user' activeClassName = 'active'>User</Link></li>
            <li><Link to = '/todo' activeClassName = 'active'>TodoFlux</Link></li>
        </ul>
        {props.children} 
    </div>
);

App.propTypes = {
    children: React.PropTypes.object,
};

export default App;